<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <!-- 主表单区域 -->
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="12" >
            <a-form-model-item label="上报时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="timestamp">
              <a-input v-model="model.timestamp" placeholder="请输入上报时间" ></a-input>

              <a-input v-model="model.timestampDict" placeholder="解析上报时间" ></a-input>
            </a-form-model-item>

          </a-col>


          <a-col :span="12" >
            <a-form-model-item label="观测时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="tt">
              <a-input v-model="model.tt" placeholder="请输入观测时间" ></a-input>
              <a-input v-model="model.ttDict" placeholder="请输入观测时间" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="设备号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="deviceNo">
              <a-input v-model="model.deviceNo" placeholder="请输入设备号" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="水气压" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="adc">
              <a-input-number v-model="model.adc" placeholder="请输入水气压" style="width: 100%" />
            </a-form-model-item>
          </a-col>

          <a-col :span="12" >
            <a-form-model-item label="1分钟内极大风速" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="afaa">
              <a-input-number v-model="model.afaa" placeholder="请输入1分钟内极大风速" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="二分钟平均风向" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aec">
              <a-input-number v-model="model.aec" placeholder="请输入二分钟平均风向" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="二分钟平均风速" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="afc">
              <a-input-number v-model="model.afc" placeholder="请输入二分钟平均风速" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="十分钟平均风向" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aed">
              <a-input-number v-model="model.aed" placeholder="请输入十分钟平均风向" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="十分钟平均风速" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="afd">
              <a-input-number v-model="model.afd" placeholder="请输入十分钟平均风速" style="width: 100%" />
            </a-form-model-item>
          </a-col>



          <a-col :span="12" >
            <a-form-model-item label="某时间段内的极大风速" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="afae">
              <a-input-number v-model="model.afae" placeholder="请输入某时间段内的极大风速" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="极大风速时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="afaf">
              <a-input v-model="model.afaf" placeholder="请输入极大风速时间" ></a-input>
              <a-input v-model="model.afafDict" placeholder="请输入极大风速时间" ></a-input>

            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="1.5米高度的空气温度" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aaa">
              <a-input-number v-model="model.aaa" placeholder="请输入1.5米高度的空气温度" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="最高温度" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aaaa">
              <a-input-number v-model="model.aaaa" placeholder="请输入最高温度" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="最高温度时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aaab">
              <a-input v-model="model.aaab" placeholder="请输入最高温度时间" ></a-input>
              <a-input v-model="model.aaabDict" placeholder="请输入最高温度时间" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="最低温度" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aaac">
              <a-input-number v-model="model.aaac" placeholder="请输入最低温度" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="最低温度时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aaad">
              <a-input v-model="model.aaad" placeholder="请输入最低温度时间" ></a-input>
              <a-input v-model="model.aaadDict" placeholder="请输入最低温度时间" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="1.5米高度的相对湿度" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ada">
              <a-input-number v-model="model.ada" placeholder="请输入1.5米高度的相对湿度" style="width: 100%" />
            </a-form-model-item>
          </a-col>

          <a-col :span="12" >
            <a-form-model-item label="本站气压" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aga">
              <a-input-number v-model="model.aga" placeholder="请输入本站气压" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="最高气压" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="agaa">
              <a-input-number v-model="model.agaa" placeholder="请输入最高气压" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="最高气压时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="agab">
              <a-input v-model="model.agab" placeholder="请输入最高气压时间" ></a-input>
              <a-input v-model="model.agabDict" placeholder="请输入最高气压时间" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="最低气压" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="agac">
              <a-input-number v-model="model.agac" placeholder="请输入最低气压" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12" >
            <a-form-model-item label="最低气压时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="agad">
              <a-input v-model="model.agad" placeholder="请输入最低气压时间" ></a-input>
              <a-input v-model="model.agadDict" placeholder="请输入最低气压时间" ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="12" >
            <a-form-model-item label="分钟降水(翻斗等)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aha1">
              <a-input-number v-model="model.aha1" placeholder="请输入分钟降水(翻斗等)" style="width: 100%" />
            </a-form-model-item>
          </a-col>

          <a-col :span="12" >
            <a-form-model-item label="露点温度温度" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="adb">
              <a-input-number v-model="model.adb" placeholder="请输入露点温度温度" style="width: 100%" />
            </a-form-model-item>
          </a-col>

          <a-col :span="24" >
            <a-form-model-item label="分钟内极大风速（瞬时风速）对应风向:" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aef">
              <a-input-number v-model="model.aef" placeholder="请输入分钟内极大风速（瞬时风速）对应风向" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" >
            <a-form-model-item label="极大风速（瞬时风速）对应风向" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aee">
              <a-input-number v-model="model.aee" placeholder="请输入极大风速（瞬时风速）对应风向" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" >
            <a-form-model-item label="最大风速（十分钟平均分速）对应风向" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="aeg">
              <a-input-number v-model="model.aeg" placeholder="请输入最大风速（十分钟平均分速）对应风向" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" >
            <a-form-model-item label="1.5米高度的相对最低湿度" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="adac">
              <a-input-number v-model="model.adac" placeholder="请输入1.5米高度的相对最低湿度" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" >
            <a-form-model-item label="1.5米高度的最低相对湿度时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="adad">
              <a-input v-model="model.adad" placeholder="请输入1.5米高度的最低相对湿度时间" ></a-input>
              <a-input v-model="model.adadDict" placeholder="请输入1.5米高度的最低相对湿度时间" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24" >
            <a-form-model-item label="某时间段内的最大风速" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="afda">
              <a-input-number v-model="model.afda" placeholder="请输入某时间段内的最大风速" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" >
            <a-form-model-item label="最大风速（10分钟平均风速）时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="afdb">
              <a-input v-model="model.afdb" placeholder="请输入最大风速（10分钟平均风速）时间" ></a-input>
              <a-input v-model="model.afdbDict" placeholder="请输入最大风速（10分钟平均风速）时间" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24" >
            <a-form-model-item label="小时累计降水（翻斗等）" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ahb1">
              <a-input-number v-model="model.ahb1" placeholder="请输入小时累计降水（翻斗等）" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" >
            <a-form-model-item label="小时内分钟降水（软件统计，翻斗）" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ahl1">
              <a-input v-model="model.ahl1" placeholder="请输入小时内分钟降水（软件统计，翻斗）" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24" >
            <a-form-model-item label="质量控制" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="qc">
              <a-input v-model="model.qc" placeholder="请输入质量控制" ></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
      <!-- 子表单区域 -->
    <a-tabs v-model="activeKey" @change="handleChangeTabs">
      <a-tab-pane tab="小时内分钟降水（软件统计，翻斗）" :key="refKeys[0]" :forceRender="true">
        <j-editable-table
          :ref="refKeys[0]"
          :loading="dataAhlTable.loading"
          :columns="dataAhlTable.columns"
          :dataSource="dataAhlTable.dataSource"
          :maxHeight="300"
          :disabled="formDisabled"
          :rowNumber="true"
          :rowSelection="true"
          :actionButton="true"/>
      </a-tab-pane>
    </a-tabs>

  </a-spin>
</template>

<script>

  import { getAction ,putAction} from '@/api/manage'
  import { FormTypes,getRefPromise,VALIDATE_NO_PASSED } from '@/utils/JEditableTableUtil'
  import { JEditableTableModelMixin } from '@/mixins/JEditableTableModelMixin'
  import { validateDuplicateValue } from '@/utils/util'

  export default {
    name: 'PudongDeviceDataForm',
    mixins: [JEditableTableModelMixin],
    components: {
    },
    data() {
      return {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        labelCol2: {
          xs: { span: 24 },
          sm: { span: 3 },
        },
        wrapperCol2: {
          xs: { span: 24 },
          sm: { span: 20 },
        },
        model:{
        },
        modelDefault:{},
        // 新增时子表默认添加几行空数据
        addDefaultRowNum: 1,
        validatorRules: {
        },
        refKeys: ['dataAhl', ],
        tableKeys:['dataAhl', ],
        activeKey: 'dataAhl',
        // 小时内分钟降水（软件统计，翻斗）
        dataAhlTable: {
          loading: false,
          dataSource: [],
          columns: [
            {
              title: '分钟',
              key: 'minute',
              type: FormTypes.input,
              width:"200px",
              placeholder: '请输入${title}',
              defaultValue:'',
            },
            {
              title: '值(mm)',
              key: 'value',
              type: FormTypes.input,
              width:"200px",
              placeholder: '请输入${title}',
              defaultValue:'',
            },
          ]
        },
        url: {
          add: "/com.pudong/pudongDeviceData/add",
          edit: "/com.pudong/pudongDeviceData/edit",
          analysis: "/com.pudong/pudongDeviceData/analysis",
          queryById: "/com.pudong/pudongDeviceData/queryById",
          dataAhl: {
            list: '/com.pudong/pudongDeviceData/queryDataAhlByMainId'
          },
        }
      }
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    },
    created () {

      // this.modelDefault = JSON.parse(JSON.stringify(this.model));
      // console.log(this.modelDefault)
      // this.handleAllDetail();
    },

    methods: {
      handleAllDetail(e){


       // this.model = JSON.parse(JSON.stringify(e))
        var id = e.id

        getAction(this.url.queryById+"?id="+id).then((item)=>{
          this.model =item.result;
        })
        getAction(this.url.dataAhl.list+"?id="+id).then((item)=>{
          this.dataAhlTable.dataSource=item.result;
        })

      },
      handleAnalysis(){

        this.confirmLoading =true;
        var id = this.model.id;
        console.log(id);
        putAction(this.url.analysis+"?id="+id).then(
         (e)=>{
           this.confirmLoading =false;
           console.log(e.result)
           var result =e.result;

           this.model =result;
           console.log(this.model.timestampDict);
           this.dataAhlTable.dataSource=result.dataAhlList;

         }
        )
      },
      addBefore(){
        this.dataAhlTable.dataSource=[]

      },
      getAllTable() {
        let values = this.tableKeys.map(key => getRefPromise(this, key))
        return Promise.all(values)

      },
      /** 调用完edit()方法之后会自动调用此方法 */
      editAfter() {
        this.$nextTick(() => {
        })
        // 加载子表数据
        if (this.model.id) {
          let params = { id: this.model.id }
          this.requestSubTableData(this.url.dataAhl.list, params, this.dataAhlTable)
        }
      },
      //校验所有一对一子表表单
      validateSubForm(allValues){
          return new Promise((resolve,reject)=>{
            Promise.all([
            ]).then(() => {
              resolve(allValues)
            }).catch(e => {
              if (e.error === VALIDATE_NO_PASSED) {
                // 如果有未通过表单验证的子表，就自动跳转到它所在的tab
                this.activeKey = e.index == null ? this.activeKey : this.refKeys[e.index]
              } else {
                console.error(e)
              }
            })
          })
      },
      /** 整理成formData */
      classifyIntoFormData(allValues) {
        let main = Object.assign(this.model, allValues.formValue)
        return {
          ...main, // 展开
          dataAhlList: allValues.tablesValue[0].values,
        }

      },
      validateError(msg){
        this.$message.error(msg)
      },

    }
  }
</script>

<style scoped>
</style>